// components/shopping_cart/shopping_cart.js
import { handleCommodityChange, getNewShoppingCarData, setNewShoppingCarData } from '../../utils/commodityOpt';
const uitl = require('../../utils/util');
const app = getApp();

App.Component({
  useStore: true,
  /**
   * 组件的属性列表
   */
  properties: {
    
  },
  lifetimes: {
    // 在组件实例进入页面节点树时执行
    attached: function() {
      this.setData({ isAttached: false })
      this.handleInitWatch()
    },
    detached: function() {
      wx.$off('carListDataUpdata') // 停止监听
    }
  },
  pageLifetimes: {
    show: function() {
      if (!this.data.isAttached) return this.setData({ isAttached: true })
      this.handleInitWatch()
    },
    
  },
  /**
   * 组件的初始数据
   */
  data: {
    isAttached: true, // Attached 是已执行过了
    bgIsShow:false, //阴影背景是否显示
    cartNavIsShow:false, // 购物车是否显示
    cartListIshow:false, // 购物车商品列表是否显示
    sumPrice:0, // 购物车总商品总价格
    sumNumber:0, // 购物车总商品数量
    commodityList: [], // 购物车商品列表
  },
  /**
   * 组件的方法列表
   */
  methods: {
    // 监听数据变动
    handleInitWatch() {
      wx.$on('carListDataUpdata', (v) => {
        console.log('我监听到变动里',v)
        if (Array.isArray(v) && v.length > 0) this.showCart()
        this.setData({ commodityList: v })
      })
    },
    // 点击背景时的回调
    sbgTapCallback(){
      this.setBgShowOrHide()
      this.setData({ cartListIshow: false });
      if(this.data.commodityList.length == 0){
        return setTimeout(() => { this.setData({ cartNavIsShow:false }) }, 100);
      }
    },
    // 选好了提交计算价格
    confirmProduct(){
      console.log('点击了计算');
      this.triggerEvent('quantityChange',{type:5,comms:this.data.commodityList});// 发送已选商品下一步
    },
    opBtn(e){ // 购物车商品列表 操作加减商品按钮
      const bInfo = e.currentTarget.dataset,
            type = parseInt(bInfo.btn), cid = bInfo.cid;
      this.handleCatShoppingChange(cid, type);
      this.triggerEvent('quantityChange', { cid, type });//type: 1=>添加 0=>删除 2=>指定数量 3=>清空
    },
    // 处理购物车里的商品变动
    handleCatShoppingChange(cid, type) {
      const newClist = getNewShoppingCarData() // 全局状态的购物车商品数据
      if (type === 3) {
        const cList = handleCommodityChange(newClist, null, 3, void 0, true);
        setNewShoppingCarData(cList); // 更新全局状态里的购车数据
      } else {
        const cInfo = this.getCommodityInfo(cid, newClist);
        const cList = handleCommodityChange(newClist, cInfo, type, void 0, true); // type: 1=>添加 0=>删除 2=>指定数量
        // if (cList && cList.length === 0) this.hideCart(); 
        if (Array.isArray(cList) && cList.length > 0) this.setData({ cartListIshow: true });
        setNewShoppingCarData(cList); // 更新全局状态里的购车数据
      }
    },
    // 计算购物车里的总价格和总数量
    calcNumPrice(cList){
      let sumPrice = 0, sumNumber = 0;
      for(let i in cList){
        sumPrice += (cList[i].price * cList[i].payNumber);
        sumNumber += cList[i].payNumber;
      }
      this.setData({sumPrice:sumPrice,sumNumber:sumNumber});
    },
    // 根据cid 获取某个商品信息
    getCommodityInfo(cid, cList){
      const cItem = cList.find(it => it.cid === cid);
      return cItem !==-1 ? cItem : null;
    },
    // 点击显示或者隐藏
    showOrHideCommList(){
      console.log('隐藏了2')
      this.setData({ cartListIshow: !this.data.cartListIshow });
      this.setBgShowOrHide(!this.data.bgIsShow)
    },
    // 隐藏购物车 
    hideCart(){
      console.log('隐藏了1')
      this.setData({cartListIshow:false, cartNavIsShow:false});
      this.setBgShowOrHide()
    },
    // 显示购物车
    showCart() {
      this.setData({ cartNavIsShow:true });
    },
    // 清除购物车里的所有数据
    handleClear(){
      this.triggerEvent('quantityChange',{type:3});// 清空
      const cList = []
      setNewShoppingCarData(cList); // 更新全局状态里的购车数据
      this.setData({commodityList:cList, sumPrice:0, sumNumber:0 }); // 清空购物车列表
    },
    // 隐藏透明阴影背景
    setBgShowOrHide(status = false) {
      return this.setData({ bgIsShow: status });
    }
  }
})
